import patchVnode from './patchVnode'
import createElement from "./createElement"
//判断两个虚拟节点是否为同一个节点
function sameVnode(vNode1,vNode2){
	//两个节点key相同，那就是同一个节点
	return vNode1.key ==vNode2.key;
}
//参数 
//真实dom节点  旧的虚拟节点 新的虚拟节点
export default (parentElm,oldCh,newCh)=>{
	let oldStartIdx = 0; //旧前指针
	let oldEndIdx = oldCh.length-1; //旧后指针
	let newStartIdx = 0; //新前指针
	let newEndIdx = newCh.length-1;//新后指针	
	let oldStartVnode = oldCh[0]; //旧前虚拟节点
	let oldEndVnode = oldCh[oldEndIdx];//旧后虚拟节点
	let newStartVnode = newCh[0]; //新前虚拟节点
	let newEndVnode = newCh[newEndIdx];//新后虚拟节点
	while(oldStartIdx<=oldEndIdx&&newStartIdx<=newEndIdx){
		if(oldStartVnode == undefined){
			oldStartVnode = oldCh[++oldStartIdx];
		}else if(oldEndVnode== undefined){
			oldEndVnode = oldCh[--oldStartIdx]
		}else if(sameVnode(oldStartVnode,newStartVnode)){//旧前 新前
			console.log(1)
			patchVnode(oldStartVnode,newStartVnode)
			//新前存在
			if( newStartVnode ) {
				//旧前的elm给新前的elm即可
				//?.  防止报错的
				newStartVnode.elm = oldStartVnode?.elm
			}
			//新旧指针++
			oldStartVnode = oldCh[++oldStartIdx];
			newStartVnode = newCh[++newStartIdx];

		}else if(sameVnode(oldEndVnode,newEndVnode)){//旧后 新后
			console.log(2)
			patchVnode(oldEndVnode,newEndVnode)
			if( newEndVnode ) {
				newEndVnode.elm = oldEndVnode?.elm
			}
			//新旧指针--
			oldEndVnode = oldCh[--oldEndIdx];
			newEndVnode = newCh[--newEndIdx];
		}else if(sameVnode(oldStartVnode,newEndVnode)){//旧前 新后
			console.log(3)
			patchVnode(oldStartVnode,newEndVnode)
			if( newEndVnode ) {
				newEndVnode.elm = oldStartVnode?.elm
			}
			//移动位置,旧前指定的节点移动到旧后指向的节点后
			parentElm.insertBefor(oldStartVnode.elm,oldEndVnode.elm.nextSibling)
			oldStartVnode = oldCh[++oldStartIdx];
			newEndVnode = newCh[--newEndIdx];
		}else if(sameVnode(oldEndVnode,newStartVnode)){//旧后 新前
			console.log(4)
			patchVnode(oldEndVnode,newStartVnode)
			if( newStartVnode ) {
				newStartVnode.elm = oldEndVnode?.elm
			}
			//移动位置,旧后指定的节点移动到旧前指向的节点前
			parentElm.insertBefor(oldEndVnode.elm,oldStartVnode.elm)
			oldEndVnode = oldCh[--oldStartIdx];
			newStartVnode = newCh[++newStartIdx];
		}else{//查找  以上四种都不满足
			//创建对象，存放虚拟节点，判断新旧有没有相同节点
			console.log(5)
			const keyMap = {};
			for(let i=oldStartIdx;i<=oldEndIdx;i++){
				const key = oldCh[i]?.key;
				if(key){
					keyMap[key]=i;
				}
			}
			//在旧节点中，查找新前指向的节点
			let idxIn0ld = keyMap[newStartVnode.key] ;
			//找到，新旧节点都有
			if(idxIn0ld){
				const elmMove = oldCh[idxIn0ld] ;
				patchVnode( elmMove, newStartVnode );
				//处理过的节点，在旧虚拟节点的数组中，设置undefined
				oldCh [idxIn0ld] = undefined;
				parentElm.insertBefore( elmMove.elm,oldStartVnode.elm)
			}else{ //是一个新节点，需要创建
				parentElm.insertBefor(createElement(newStartVnode),oldStartVnode.elm)
			}
			//新节点指针++
			newStartVnode = newCh[++newStartIdx]
		}
	}
	//删除和创建情况：
	//1.oldStartIdx>oldEndIdx
	//2.newStartIdx > newEndIdx
	if(oldStartIdx>oldEndIdx){
		const before = newCh[newEndIdx+1]?newCh[newEndIdx+1].elm:null
		for( let i=newStartIdx ;i<=newEndIdx ; i++){
			parentElm.insertBefore( createElement(newCh[i] ),before);
		}

	}else{ //删掉
		for( let i = oldStartIdx; i<=oldEndIdx;i++)
			parentElm. removeChild(oldCh[i].elm);
		}

	}

}
